
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

/// 创建人： Created by zhaolong
/// 创建时间：Created by  on 2020/9/25.
///
/// gongzhonghao biglead
/// github https://github.com/zhaolongs
/// bili https://space.bilibili.com/513480210
/// zhihu https://www.zhihu.com/people/zhao-long-90-89
/// csdn https://blog.csdn.net/zl18603543572
/// 西瓜视频 https://www.ixigua.com/home/3662978423
///
///
///

//应用入口
void main() {
  ///启动根目录
  runApp(MaterialApp(
    theme: ThemeData(primaryColor: Colors.grey[200]),
    home: Example508(),
  ));
}

///代码清单 5-34 PageView的基本使用
///lib/code5/example_508_PageView.dart
class Example508 extends StatefulWidget {
  const Example508({Key? key}) : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return _ExampleState();
  }
}

class _ExampleState extends State<Example508> {

  ///代码清单 5-6-2 PageView 控制器
  ///lib/code5/example_508_PageView.dart
  /// 初始化控制器
  late PageController pageController;
  //PageView当前显示页面索引
  int currentPage = 0;

  @override
  void initState() {
    super.initState();
    //创建控制器的实例
    pageController =  PageController(
      //用来配置PageView中默认显示的页面 从0开始
      initialPage: 0,
      //为true是保持加载的每个页面的状态
      keepPage: true,
    );

    ///PageView设置滑动监听
    pageController.addListener(() {
      //PageView滑动的距离
      double offset = pageController.offset;
      //当前显示的页面的索引
      double? page = pageController.page;
      print("pageView 滑动的距离 $offset  索引 $page");
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("PageView "),
      ),
      body: buildPageView(),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.arrow_upward),
        onPressed: () {
          //
          if (currentPage > 0) {
            //滚动到上一屏
            pageController.animateToPage(
              currentPage - 1,
              curve: Curves.ease,
              duration: Duration(milliseconds: 200),
            );
          }
        },
      ),
    );
  }

  ///代码清单 5-6-1 PageView builder 方式来创建
  ///lib/code5/example_508_PageView.dart
  ///懒加载模式 适用于大量数据
  PageView buildPageView() {
    return PageView.builder(
      //当页面选中后回调此方法
      //参数[index]是当前滑动到的页面角标索引 从0开始
      onPageChanged: (int index) {
        print("当前的页面是 $index");
        currentPage = index;
      },
      //值为flase时 显示第一个页面 然后从左向右开始滑动
      //值为true时 显示最后一个页面 然后从右向左开始滑动
      reverse: false,
      //滑动到页面底部回弹效果
      physics: const BouncingScrollPhysics(),
      scrollDirection: Axis.vertical,//纵向滑动切换
      controller: pageController, //页面控制器
      //所有的子Widget
      itemBuilder: (BuildContext context, int index) {
        return SizedBox(
          width: MediaQuery.of(context).size.width,
          child: Image.asset(
            "assets/images/loginbg.png",
          ),
        );
      },
    );
  }

  ///代码清单 5-6-3 控制器常用方法
  ///lib/code5/example_508_PageView.dart
  void pageViewController() {
    //动画的方式滚动到指定的页面
    pageController.animateToPage(
      0,//子Widget的索引
      curve: Curves.ease,//动画曲线
      //滚动时间
      duration: const Duration(milliseconds: 200),
    );

    //动画的方式滚动到指定的位置
    pageController.animateTo(
      100,
      //动画曲线
      curve: Curves.ease,
      //滚动时间
      duration: Duration(milliseconds: 200),
    );

    //无动画切换到指定的页面
    pageController.jumpToPage(0);
    //无动画 切换到指定的位置
    pageController.jumpTo(100);
  }
}
